<template>
    <view class="index">
        <view class="custom" :style="'top:' + customTop + 'px'" @click="goBack">
            <u-icon name="arrow-left" color="#000"></u-icon>
            <text>返回</text>
        </view>
        <view class="main">
        <view class="header" :style="'padding-top:' + titleHeight + 'px'">
            <view class="search-box">
                <input v-model="queryObj.bt" placeholder="搜索" style="width: 70%"  @confirm="updateData"/>
                <u-icon name="close-circle" v-if="queryObj.bt" @click="clear"></u-icon>
                <text class="search-icon" @click="updateData">搜索</text>
            </view>
        </view>
        </view>
        <s-enterprise :goodsList="list" @updateData="updateData"></s-enterprise>
        <view class="wrap">
            <u-back-top :scroll-top="scrollTop"></u-back-top>
        </view>
        <!-- 授权弹窗 -->
        <s-auth-modal />
    </view>
</template>
<script>
import {myMixins} from "@/mixins/myMixins";
import {getInformationListApi} from "@/sheep/api";

export default {
    mixins:[myMixins],
    data() {
        return {
            titleHeight: 0,
            customTop:0,
            queryObj:{
                bt:'',
            },
            list:[]
        };
    },
    onLoad() {
    },
    onShow(options) {
        this.getHeight()
    },
    methods:{
        goBack() {
            uni.navigateBack();
        },
        // 获取微信右上角胶囊高度
        getHeight() {
            let res = uni.getMenuButtonBoundingClientRect();
            this.titleHeight = res.top + res.height + 16;
            this.customTop = res.top + 3;
        },
        getList(){
            console.log("this.queryObj", this.queryObj);
            getInformationListApi(this.queryObj).then(res=>{
                this.list = this.list.concat(res.rows)
                this.total = res.total
                if (this.queryObj.pageNum*this.queryObj.pageSize<this.total){
                    this.status = 'loadmore'
                }else{
                    this.status = 'nomore'
                }
                uni.stopPullDownRefresh()
            })
        },
        updateData(data){
            this.queryObj.pageNum = 1
            this.total = 0
            this.status = 'loadmore'
            this.list = []
            this.getList()
        },
        clear() {
            this.queryObj.bt = "";
            this.updateData()
        },
    },
};
</script>
<style lang="scss" scoped>
.index {
    .custom {
        position: absolute;
        left: 30rpx;
        font-size: 30rpx;
        display: flex;
        align-items: center;
    }
    .main {
        padding: 0 30rpx;
        .header {
            display: flex;
            padding: 42rpx 0;
            color: #fff;
            justify-content: space-between;
            &::after {
                content: "";
                position: absolute;
                left: 0;
                right: 0;
                top: 0;
                bottom: 0;
                width: 100%;
                height: 100%;
                background: url("https://www.cjzn.fun/profile/uploadPath/indexbg.png")
                no-repeat;
                background-size: 100% auto;
                z-index: -2;
            }
            .search-box {
                // background-color: #fff;
                border: #000 1rpx solid;
                border-radius: 40rpx;
                width: 100%;
                height: 70rpx;
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 0 5rpx 0 30rpx;
                color: #333;
                font-size: 26rpx;
                .search-icon {
                    background-color: #000;
                    border-radius: 40rpx;
                    color: #fff;
                    height: 60rpx;
                    width: 120rpx;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }
            }
        }
    }
    .goodsList {
        flex: 4;
        .goodsItem {
            padding: 15rpx 30rpx;
            display: flex;
            align-items: center;
            .goodsInfo {
                flex: 1;
                padding: 0 0 0 15rpx;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                .wordLimit {
                    overflow: hidden;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    /* 设置最大显示行数 */
                    -webkit-box-orient: vertical;
                    text-overflow: ellipsis;
                }
                .goodsBottom {
                    display: flex;
                    justify-content: space-between;
                    .goodsBut {
                        display: flex;
                        border-radius: 6rpx;
                        font-size: 24rpx;
                        width: 120rpx;
                        height: 40rpx;
                        background-color: yellow;
                        align-items: center;
                        justify-content: center;
                        border: #dddddd 1rpx solid;
                    }
                }
            }
        }
    }
}
</style>
